<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>登录</title>
    <link rel="stylesheet" href="css/common.css">
    <link rel="stylesheet" href="layui/css/layui.css">
    <style>
        .main {
            margin: 50px auto;
            text-align: center;
        }

        .main p:first-child {
            font-size: 25px;

        }

        .main p {
            margin-top: 15px;
        }

        .main img {
            width: 60px;
        }

        .main p span,
        input {
            font-size: 18px;
        }

        .main p input {
            border-bottom: 1px solid #ccc;
        }

        button {
            width: 200px;
            height: 40px;
            border-radius: 10px;
            line-height: 40px;
            background-color: #386bf3;
            font-size: 18px;
            color: #fff;
            margin-top: 30px;
            cursor: pointer;
        }

        .main p:last-child {
            font-size: 15px;
        }

        .regist {
            color: red;
            cursor: pointer;
        }
    </style>
</head>

<body>
    <div class="main">
        <p>欢迎加入江大二手市场</p>
        <img src="img/market.png" alt="">
        <p>
            <span>手机</span>
            <input type="text" class="phone" autocomplete="on">
        </p>
        <p>
            <span>密码</span>
            <input type="text" class="password" autocomplete="on">
        </p>

        <button>登录</button>
        <p>没有账号？赶快<span class="regist">注册</span>吧！</p>
    </div>
    <script src="js/jquery-1.10.1.min.js"></script>
    <script src="layui/layui.all.js"></script>
    <script src="js/url.js"></script>
    <script>
        $(".regist").click(function () {
            var index = parent.layer.getFrameIndex(window.name);
            parent.layer.close(index); //关闭当前页
            parent.layer.open({
                type: 2,
                title: false,
                area: ['300px', '450px'],
                content: 'regist.html' //这里content是一个URL，如果你不想让iframe出现滚动条，你还可以content: ['http://sentsin.com', 'no']
            });
        })

        $("button").click(function () {
            var phone = $(".phone").val().trim();
            var password = $(".password").val().trim();
            if (phone == "" || phone == null) {
                phone = null;
            }
            if (password == "" || password == null) {
                password = null;
            }
            if (phone == null || password == null) {
                layer.open({
                    title: '信息',
                    content: '请保持信息完整!'
                });
            } else {
                doLogin(phone, password);
            }
        })

        function doLogin(phone, password) {
            $.ajax({
                type: "post",
                url: URL + "/user/doLogin",
                data: {
                    phone: phone,
                    password: password
                },
                dataType: "json",
                success: function (data) {
                    if (data.code == 0) {
                        layer.open({
                            title: '信息',
                            content: '登录失败！'
                        });
                    } else if (data.code == 1) {
                        layer.open({
                            title: '信息',
                            content: '登录成功！',
                            yes: function () {
                                var index = parent.layer.getFrameIndex(window.name);
                                parent.layer.close(index); //关闭当前页
                                localStorage.setItem("phone",phone);
                                localStorage.setItem("password",password);
                                parent.window.location.reload();
                            }
                        });

                    }
                }
            });
        }
    </script>
</body>

</html>